#app{
  // 主体区域
  // .main-container {
  //   min-height: 100%;
  //   transition: margin-left .28s;
  //   margin-left: 200px;
  //   position: relative;
  //   // padding-top: 58px;
  //   // background: #f2f2f2;
  //   // overflow: hidden;
  // }
  // 侧边栏
  // .sidebar-container {
  //   transition: width 0.28s;
  //   width: 200px !important;
  //   min-height: 100%;
  //   position: fixed;
  //   font-size: 0px;
  //   top: 0;
  //   bottom: 0;
  //   left: 0;
  //   z-index: 1001;
  //   overflow: visible;
  //   // float:left;
  //   //reset element-ui css
  //   .horizontal-collapse-transition {
  //     transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
  //   }
  //   .scrollbar-wrapper {
  //     overflow-x: hidden!important;
  //     // .el-scrollbar__view {
  //     //   height: 100%;
  //     // }
  //   }
  //   .el-scrollbar__bar.is-vertical{
  //     right: 0px;
  //   }
  //   .el-scrollbar {
  //     height: 100%;
  //   }
  //   &.has-logo{
  //     .el-scrollbar {
  //       height: calc(100% - 50px);
  //     }
  //   }
  //   .is-horizontal {
  //     display: none;
  //   }
  //   a {
  //     display: inline-block;
  //     width: 100%;
  //     overflow: hidden;
  //   }
  //   .svg-icon {
  //     margin-right: 16px;
  //   }
  //   .el-menu {
  //     border: none;
  //     height: 100%;
  //     width: 100% !important;
  //   }
  //   // 
  //   .el-menu-item, .el-submenu__title{
  //       color: #16477c !important;
  //       background: #fff !important;
  //       margin: 6px 10px 10px 10px;
  //       font-weight: 600;

  //       overflow: hidden !important;
  //       text-overflow: ellipsis !important;  //常见的单行文本溢出显示省略号
  //   }
  // }

  // menu hover 鼠标悬浮在菜单上样式变化
  .submenu-title-noDropdown,
  .el-submenu__title {
    &:hover {
      background-color: rgba(18, 104, 22, 0.06) !important;
    }
  }
  //  .nest-menu li.el-menu-item {
  //   background: #1D2B3B !important;
  // } 

  & .nest-menu .el-submenu>.el-submenu__title,
  & .el-submenu .el-menu-item {
    min-width: 200px !important;  // 侧边栏二级菜单样式
    // background: #1D2B3B !important;

    &:hover {
      background-color: rgba(18, 104, 22, 0.06) !important;
    }
  }


  .hideSidebar {
    .sidebar-container {
      width: 36px !important;
    }
    .main-container {
      margin-left: 36px;
    }
    .submenu-title-noDropdown {
      padding-left: 10px !important;
      position: relative;
      .el-tooltip {
        padding: 0 10px !important;
      }
    }
    .el-submenu {
      overflow: hidden;
      &>.el-submenu__title {
        padding-left: 10px !important;
        .el-submenu__icon-arrow {
          display: none;
        }
      }
    }
    .el-menu--collapse {
      .el-submenu {
        &>.el-submenu__title {
          &>span {
            height: 0;
            width: 0;
            overflow: hidden;
            visibility: hidden;
            display: inline-block;
          }
        }
      }
    }
  }
  .sidebar-container .nest-menu .el-submenu>.el-submenu__title,
  .sidebar-container .el-submenu .el-menu-item {
    min-width: 160px !important;
    background-color: #fff !important;
    color: #333 !important;
    font-size: 14px;
    margin: 0 10px;
    font-weight: 400;
    &:hover {
      background-color: #edf3fe !important;
      color: #16477c !important
    }
    span{
      margin-left: -20px
    }
    span{
      margin-left: -20px
    }
    span{
      margin-left: -20px
    }
  }
  .sidebar-container .el-menu-item.is-active {
    background-color: #edf3fe !important;
    color: #16477c !important;
  }
  .sidebar-container .el-menu-item.is-active {
    background-color: #edf3fe !important;
    color: #16477c !important;
  }
  .sidebar-container .el-menu-item.is-active {
    background-color: #edf3fe !important;
    color: #16477c !important;
  }
  .sidebar-container .el-menu-item.is-active {
    background-color: #edf3fe !important;
    color: #16477c !important;
  }
  .el-menu--collapse .el-menu .el-submenu {
    min-width: 180px !important;
  }

  //适配移动端
  .mobile {
    .main-container {
      margin-left: 0px;
    }
    .sidebar-container {
      transition: transform .28s;
      width: 180px !important;
    }
    &.hideSidebar {
      .sidebar-container {
        transition-duration: 0.3s;
        transform: translate3d(-180px, 0, 0);
      }
    }
  }
  .withoutAnimation {
    .main-container,
    .sidebar-container {
      transition: none;
    }
  }
}

// .el-menu--vertical{
//   & >.el-menu{
//     .svg-icon{
//       margin-right: 16px;
//     }
//   }
// }
